<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/basic_form_style.css" rel="stylesheet" type="text/css" />
<link href="css/table_style1.css" rel="stylesheet" type="text/css" />
<script src="jquery/js/jquery-1.7.2.min.js"></script>
<style type="text/css">
.subHead{text-align:center}
</style>

<script type="text/jscript">
	function addNewClass()
	{	var class_name=document.getElementById('class_name').value;
		var teacher_name=document.getElementById('guide_name').value;
		var day=document.getElementById('day').value;
		var start_time=document.getElementById('select_start').value;
		var end_time=document.getElementById('select_end').value;
		// DO NOT FORGET TO ADD CAPACITY
		if( class_name=="" || teacher_name=="" || day == "" || start_time==""|| end_time=="")
			alert("Plaese fill all the fieldes !!!"); 
		else{
			$.post("content/class_ajax.php",{s:1, className:class_name, teacherName:teacher_name,Day:day, startTime:start_time, endTime:end_time},function(data){document.getElementById('toReplace').innerHTML =data});
		}
	
	}
</script>
</head>

<body>
<center>
    <table width="724" height="340" border="0" >
      <tr>
        <td colspan="4" > <center><h1 class="primeHead">Add New Class</h1></center></td>
      </tr>
      <form id="form1" name="form1" method="post" action="">
          <tr>
            <td width="173" class="subHead">class Name :</td>
            <td width="176"><label for="class_name"></label>
            <input type="text" name="class_name" id="class_name" /></td>
            <td width="158" class="subHead">Day :</td>
            <td width="199"><label for="day"></label>
            <input type="text" name="day" id="day" /></td>
          </tr>
           <tr>
            <td width="173" class="subHead">Guide Name :</td>
            <td width="176"><label for="guide_name"></label>
            <input type="text" name="guide_name" id="guide_name" /></td>
            <td width="158" class="subHead">Max Students :</td>
            <td width="199"><label for="max_students"></label>
            <input type="text" name="max_students" id="max_students" /></td>
          </tr>
          <tr>
      <td colspan="1"><h3 class="subHead">Start Hour:</h3></td>
      <td colspan="1" ><label for="select_start"></label>
        <select name="select_start" id="select_start" style="width:140px">
        <option > 16:00:00</option>
        <option > 17:00:00</option>
        <option > 18:00:00</option>
        <option > 19:00:00</option>
        </select>
      </td>
      <td colspan="1" id="type_label"><h3 class="subHead"> End Hour:</h3></td>
      <td colspan="1"><label for="select_type"></label>
        <select name="select_type" id="select_end" style="width:140px">
        <option > 17:00:00</option>
        <option > 18:00:00</option>
        <option > 19:00:00</option>
        <option > 20:00:00</option>
        </select>
      </td>
    </tr>
    <tr>
            <td colspan="4"><input style="margin-left:530px; font-size:17px;" type="submit" class="TriggerButton" name="addClass" id="addClass" value="Add Class" onclick="addNewClass();return false;" /></td>
          </tr>
         
      </form>
      <tr><td colspan="4">
	      <center><h3 id="toReplace"></h3></center>
      </td></tr>
    </table>
</center>
</body>
</html>